import React, {useEffect, useMemo, useState} from 'react'
// import Table from '@/components/Table';
// import {Select} from 'antd'
import CustomTable from '@/components/Table'
import Styles from './index.less'
import {getRecordList} from '@/service/merchantCenter/clue'

// const {Option} = Select

interface AccordingToRecordsType {
	clueId: any
	keysObj: any
}

export default function AccordingToRecordsOld({
	clueId,
	keysObj,
}: AccordingToRecordsType) {
	// const [pagination, setPagination] = useState({ current: 1, size: 10 });
	const [formData, setFormData] = useState({})
	const [total, setTotal] = useState()
	const [params, setParams] = useState({
		current: 1,
		pageSize: 10,
	})
	const [tableList, setTableList] = useState<any[]>([])
	const [loading, setLoading] = useState(false)

	const getTabelValue = async (value: any, pagination?: any) => {
		setLoading(true)
		let values = value
		setFormData(values)
		const newPagination = pagination || {
			current: 1,
			size: params.pageSize,
		}
		setParams(newPagination)
		values = {
			...values,
			...newPagination,
		}
		const res = await getRecordList({...values, clueId})
		if (res?.data) {
			setTotal(res.data?.total || 0)
			if (res.data?.records) {
				setTableList(res.data?.records || [])
			}
		}
		setLoading(false)
	}

	useEffect(() => {
		getTabelValue(formData)
	}, [clueId])

	const Colnums: any[] = useMemo(() => {
		const arr: any[] = [
			{
				title: '跟进人',
				dataIndex: 'userName',
				align: 'center',
				width: 100,
			},
			{title: '推荐人', dataIndex: 'referrerName', align: 'center', width: 100},
			{
				title: '跟进时间',
				dataIndex: 'createTime',
				align: 'center',
				width: 200,
			},
			{
				title: '线索跟进状态',
				dataIndex: 'traceStatus',
				align: 'center',
				width: 120,
				render: (text: any) => keysObj[text],
			},
			{title: '跟进结果录入', dataIndex: 'description', align: 'center'},
		]
		return arr
	}, [])

	return (
		<div className={Styles.content}>
			<CustomTable
				params={params}
				columns={Colnums}
				total={total}
				pagination
				callback={(pagination: any) => {
					getTabelValue(formData, pagination)
				}}
				loading={loading}
				dataSource={tableList}
			/>
		</div>
	)
}
